import {ActionType, ProColumns, ProTable,} from '@ant-design/pro-components';
import {Button, Divider, Popconfirm, Space, Typography} from 'antd';
import React, {useRef, useState} from 'react';
import CreateModal from './components/CreateModal';
import UpdateModal from './components/UpdateModal';
import message from "antd/es/message";
import {deleteCategory, getCategorySearch} from "@/services/Admin/categoryManage";

export const waitTimePromise = async (time: number = 100) => {
  return new Promise((resolve) => {
    setTimeout(() => {
      resolve(true);
    }, time);
  });
};

/**
 * 商品类型管理页面
 * @constructor
 */
const AdminCategoryPage: React.FC<unknown> = () => {
  const [createModalVisible, setCreateModalVisible] = useState<boolean>(false);
  const [updateModalVisible, setUpdateModalVisible] = useState<boolean>(false);
  // @ts-ignore
  const [updateData, setUpdateData] = useState<Admin.CategoryResult>({});
  // @ts-ignore
  const [data, setData] = useState<Admin.PageQueryVO<Admin.CategoryResult>>({});
  const actionRef = useRef<ActionType>();

  /**
   * 表格列配置
   */
  const columns: ProColumns<Admin.CategoryResult>[] = [
    {
      dataIndex: 'id',
      valueType: 'indexBorder',
      width: 48,
    },
    {
      title: '分类名称',
      dataIndex: 'categoryName',
    },
    {
      title: '分类状态',
      dataIndex: 'categoryStatus',
      valueType: 'select',
      valueEnum: {
        0: {
          text: '禁用',
          status: 'Error'
        },
        1: {
          text: '启用',
          status: 'Success'
        }
      }
    },
    {
      title: '创建时间',
      dataIndex: 'createTime',
      valueType: 'dateTime',
      search: false,
    },
    {
      title: '操作',
      dataIndex: 'option',
      valueType: 'option',
      render: (_, record) => (
        <Space split={<Divider type="vertical" />}>
          <Typography.Link
            onClick={() => {
              setUpdateData(record);
              setUpdateModalVisible(true);
            }}
          >
            修改
          </Typography.Link>
          <Popconfirm
            title="您确定要删除么？"
            onConfirm={() => {
              deleteCategory(record.id).then(message.success("删除成功"));
              actionRef.current?.reload();
            }}
            okText="确认"
            cancelText="取消"
          >
            <Typography.Link type="danger">删除</Typography.Link>
          </Popconfirm>
        </Space>
      ),
    },
  ];


  return (
    <>
      <ProTable<Admin.CategoryResult>
        headerTitle="商品类型管理"
        actionRef={actionRef}
        rowKey="id"
        search={{
          labelWidth: 'auto',
        }}
        toolBarRender={() => [
          <Button
            key="1"
            type="primary"
            onClick={() => setCreateModalVisible(true)}
          >
            新建
          </Button>,
        ]}
        pagination={
          {
            pageSize:8,
            total:data.total
          }
        }
        request={async (params, sorter, filter) => {
          const res=await getCategorySearch({...params} as Admin.CategoryQueryParams);
          res.list.map((item)=>{
            // @ts-ignore
            item.createTime=new Date(item.createTime[0],item.createTime[1],item.createTime[2],item.createTime[3],item.createTime[4],item.createTime[5]);
          });
          setData(res);
          return {
            data: res.list || [],
          } as any;
        }}
        columns={columns}
      />
      <CreateModal
        modalVisible={createModalVisible}
        onCancel={() => setCreateModalVisible(false)}
        onSubmit={async ()=>{
          await waitTimePromise(500);
          setUpdateModalVisible(false);
          actionRef.current?.reload();
        }}
      />
      <UpdateModal
        oldData={updateData}
        modalVisible={updateModalVisible}
        onSubmit={async () => {
          await waitTimePromise(500);
          setUpdateModalVisible(false);
          actionRef.current?.reload();
        }}
        onCancel={() => setUpdateModalVisible(false)}
        />
    </>
  );
};

export default AdminCategoryPage;
